<template>

    <Modal
            width="800"
            v-model="visible"
            :title="title"
            :key="key"
    >
        <Spin size="large" fix v-if="Loading"></Spin>
        <Form ref="model" :model="model" :rules="rules" inline :label-width="160" :disabled=disableSubmit>
            <Row>
                <i-col span="12">
                    <FormItem label="收入所属:" prop="ssba0001">
                        <c-dict-select v-model="model.ssba0001" dicType="service" :width="200"
                                       dictService="/api/ac/subsistence/ss11302Service/getAssistanceMemberList"
                                       :serviceParam="serviceParam"/>
                    </FormItem>
                </i-col>
                <i-col span="12">
                    <FormItem label="收入类别:" prop="ssba0003">
                        <c-dict-select v-model="model.ssba0003" dictCode="incometype" :width="200"/>
                    </FormItem>
                </i-col>
            </Row>
            <Row>
                <i-col span="12">
                    <FormItem label="月收入金额:" prop="ssba0006">
                        <InputNumber :min="0" :max="999999" v-model="model.ssba0006" class="itemStyle"
                                     placeholder="请输入月收入金额"/>
                    </FormItem>
                </i-col>
                <i-col span="12">
                    <FormItem label="土地类型:" prop="ssba0004">
                        <c-dict-select v-model="model.ssba0004" dictCode="landtype" :width="200"/>
                    </FormItem>
                </i-col>
            </Row>
            <Row>
                <i-col span="12">
                    <FormItem label="土地亩数:" prop="ssba0005">
                        <InputNumber :min="0" :max="999999" v-model="model.ssba0005" class="itemStyle"
                                     placeholder="请输入土地亩数"/>
                    </FormItem>
                </i-col>
                <i-col span="12">
                    <FormItem label="一次性收入时间范围:" prop="daterange">
                        <DatePicker type="daterange" v-model="model.daterange" class="itemStyle" placeholder="请选择收入时间"/>
                    </FormItem>
                </i-col>
            </Row>

        </Form>
        <div slot="footer">
            <Button @click="cancel">取消</Button>
            <template v-if="!disableSubmit">
                <Button type="primary" @click="ok">确定</Button>
            </template>
        </div>
    </Modal>

</template>

<script>
    import ICol from "view-design/src/components/grid/col";
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import {postAction} from '@/api/request'

    export default {
        mixins: [CommonMixin],
        components: {ICol},
        name: "ss11303-modal",
        data() {
            const validateSsba0006 = (rule, value, callback) => {
                if (!this.model.ssba0006 && rule.required) {
                    callback(new Error('请输入月收入金额'));
                } else {
                    callback();
                }
            };
            const validateSsba0005 = (rule, value, callback) => {
                if (!this.model.ssba0005 && rule.required) {
                    callback(new Error('请输入土地亩数'));
                } else {
                    callback();
                }
            };
            return {
                serviceParam: {
                    azcp0500: this.$parent.queryParam.azcp0500,
                },
                visible: false,
                disableSubmit: false,
                title: "",
                model: {
                    ssba0003: "",
                },
                key: "",
                Loading: false,
                url: {
                    update: '/api/ac/subsistence/ss11303Service/update',
                    insert: '/api/ac/subsistence/ss11303Service/insert',
                },
                rules: {
                    ssba0001: [
                        {required: true, message: '请选择收入所属人', trigger: 'blur'}
                    ],
                    ssba0003: [
                        {required: true, message: '请选择收入类别', trigger: 'blur'}
                    ],
                    ssba0006: [
                        {required: true, trigger: 'blur', validator: validateSsba0006},
                    ],
                    ssba0005: [
                        {required: true, trigger: 'blur', validator: validateSsba0005},
                    ],
                    ssba0004: [
                        {required: false, trigger: 'blur', message: '请选择土地类型'},
                    ],
                    daterange: [{message: '请选择一次性收入范围', trigger: 'blur', required: false, pattern: /.+/}],
                },
            }
        },
        watch: {
            'model.ssba0003': function (val, oldVal) {
                if (oldVal) {
                    this.setRules();
                }
            },
        },
        methods: {
            cancel() {

                this.visible = false;
                this.$delete(this.model, 'ssba0003')
            },
            ok() {
                var that = this;
                this.$refs['model'].validate((valid) => {
                    if (valid) {
                        that.submitFrom();
                    }
                })
            },
            submitFrom() {
                var that = this;
                that.Loading = true;
                var url = this.url.insert;
                if (that.model.id) {
                    url = this.url.update;
                }
                if (this.model.daterange) {
                    that.model.ssba0007 = this.model.daterange[0];
                    that.model.ssba0009 = this.model.daterange[1];
                }
                postAction(url, that.model).then((res) => {
                    if (res.data.errcode != 0) {
                        this.$Message.error(res.data.errmsg);
                    } else {
                        that.$Message.success("保存完成！");
                        this.$emit('ok');
                        this.visible = false;
                        this.$delete(this.model, 'ssba0003')
                    }
                }).finally(() => {

                    that.Loading = false;
                });
            },
            add() {
                this.edit({});
            },
            edit(row) {
                row.azcp0500 = this.$parent.queryParam.azcp0500;
                this.model = Object.assign({}, row);
                if (!this.model.ssba0005) {
                    this.model.ssba0005 = null;
                }
                if (!this.model.ssba0006) {
                    this.model.ssba0006 = null;
                }
                if (row.ssba0007 && row.ssba0009) {
                    var daterange = new Array();
                    daterange.push(this.DateFormat(row.ssba0007, 'YYYY-MM-DD'));
                    daterange.push(this.DateFormat(row.ssba0009, 'YYYY-MM-DD'));
                    this.$set(this.model, "daterange", daterange);
                }
                this.visible = true;
            },
            setRules() {
                let ssba0003 = this.model.ssba0003;
                this.rules["daterange"][0].required = false;
                this.rules["ssba0004"][0].required = false;
                this.rules["ssba0005"][0].required = false;
                if (ssba0003 == '60') {//一次性收入
                    if (!this.model.daterange) {
                        this.$set(this.model, 'daterange', "");
                    }
                    this.rules["daterange"][0].required = true;
                    this.model.ssba0005 = null;
                } else if (ssba0003 == '70') {//土地
                    this.rules["ssba0004"][0].required = true;
                    this.rules["ssba0005"][0].required = true;
                    if (this.model.daterange) {
                        this.$delete(this.model, 'daterange')
                    }
                } else {
                    this.model.ssba0006 = null;
                    this.model.ssba0005 = null;
                    if (this.model.daterange) {
                        this.$delete(this.model, 'daterange')
                    }
                }
            }
        }
    }
</script>

<style scoped>
    .itemStyle {
        width: 200px
    }
</style>